<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <meta http-equiv="x-ua-compatible" content="ie=edge">
  <title>周迎川的Web大作业</title>
  <!-- MDB icon -->
  <link rel="icon" href="img/mdb-favicon.ico" type="image/x-icon">
  <!-- Font Awesome -->
  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.11.2/css/all.css">
  <!-- Bootstrap core CSS -->
  <link rel="stylesheet" href="css/bootstrap.min.css">
  <!-- Material Design Bootstrap -->
  <link rel="stylesheet" href="css/mdb.min.css">
  <!-- Your custom styles (optional) -->
  <link rel="stylesheet" href="css/style_end.css">
</head>

<body>

  <!-- Start your project here-->
  <main id="begin">

    <div class="container">


      <h1 class="font-weight-bold text-center mb-4 pt-3 text-black">《Web应用基础》课程结业报告</h1>
      <p class="text-center w-responsive mx-auto mb-5">
        作者：631907060434 周迎川 &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;
        学院：信息科学与工程学院 &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;
        班级：曙光1901班
      </p>

      <hr class="my-4">

      <h3 class="font-weight-bold  mb-4 pt-3 text-black">网站主题</h3>
      <p class=" w-responsive mb-5">
        经过我再三思考，决定使用MDB框架写一个静态网页，并且托管到GitHub上，主题是关于本人从小学到大学的教育经历。

      </p>

      <hr class="my-4">

      <h3 class="font-weight-bold  mb-4 pt-3 text-black">网站内容</h3>
      <p class="  w-responsive mb-5">
        本次实验一共写了七个网页，其中包括网站的Home(index.html)，小学(primary.html)，初中(junior.html)，高中(senior.html)，
        以及本人的特殊经历（高四）(senior4.html)，大学(university.html)，还有实验报告(ending.html)。
      </p>
      <div>
        <h5 class="font-weight-bold  mb-4 pt-3 text-black">Home(<a href="index.html">index.html</a>)</h5>
        <p class="w-responsive mb-5">首页是整个网页的一个导航，以及用一句话总结没一个阶段。</p>

        <h5 class="font-weight-bold  mb-4 pt-3 text-black">小学(<a href="primary.html">primary.html</a>)</h5>
        <p class="w-responsive mb-5">首先是对我小学学校的介绍，然后附上我小学时的照片，并做相应的解释，和自己现在的感想。</p>

        <h5 class="font-weight-bold  mb-4 pt-3 text-black">初中(<a href="junior.html">junior.html</a>)</h5>
        <p class="w-responsive mb-5">首先是对自己中学学校的介绍，然后附上一个视频，视频里面是我初中最好的朋友。
          再下面是我与几个好朋友初中毕业时的和合照，以及他们在我心里是什么样的性格特征。最下面是我的初中毕业照，
          并且结合现在和以前写出了自己的想法。
        </p>

        <h5 class="font-weight-bold  mb-4 pt-3 text-black">高中(<a href="senior.html">senior.html</a>)</h5>
        <p class="w-responsive mb-5">首先是对自己中学学校的介绍，下面是对我高中的记录，只是选出了我觉得有代表意义一点的，
          最下面是我的高中毕业照，并且结合现在和以前写出了自己的想法。</p>

        <h5 class="font-weight-bold  mb-4 pt-3 text-black">高四(<a href="senior4.html">senior4.html</a>)</h5>
        <p class="w-responsive mb-5">这个部分分成了四个部分，首先是高四前期，前期在新的班级，心生物是人非之感，以及自己高四的想法。
          中期记录了好久不下雪的高中学校，突然下了一场大学，自己的心情，以及对未来的期望。第三部分，是我第二次高考完之后的所感所想。
          最后面是记录了我的几个朋友在高考考场上拍下的留恋照片，以及我高四的毕业照，并且分享了自己现在的感想。
        </p>

        <h5 class="font-weight-bold  mb-4 pt-3 text-black">大学(<a href="university.html">university.html</a>)</h5>
        <p class="w-responsive mb-5">首先是对自己身处的大学进行介绍，然后就是对我们大学必须过的第一科《军训》，
          在下面是自己和较大第一次见面的所见所感。接着就是我学计算机专业以来的经历和感想。</p>

        <h5 class="font-weight-bold  mb-4 pt-3 text-black">Ending(<a href="#begin">ending.html</a>)</h5>
        <p class="w-responsive mb-5">最后是自己的实验报告，包括网页主题，网页内容，网页开发过程，开发中未解决的问题，总结。</p>

      </div>


      <hr class="my-4">

      <h4 class="font-weight-bold  mb-4 pt-3 text-black">开发过程</h4>
      <p class=" w-responsive mb-5">
        首先是对自己网页主题的选取，然后是确定网页内容，再选取前端技术，最后确定使用MDB框架。
      <pre class=" mb-5">主要参考网站：https://qige.io/
             https://mdbootstrap.com/
             https://www.runoob.com/
             https://getbootstrap.net/
             https://www.youzhan.org/
        </pre>
      </p>



      <hr class="my-4">

      <h4 class="mb-4 pt-3 text-black">遇到的问题</h4>
     
      <p class="mb-4 pt-3 text-black">1. 我想将导航条一直固定在同一个地方，切换页面之切换导航条以下的部分，我记得老师讲过，但是我最后还是没有成功。</p>
      <p class="mb-4 pt-3 text-black">2. 实现滑动滚轮，导航条收缩，此问题在棋歌教学网上面找到了解决办法，具体实现原理，我暂时没有理解到。</p>
      <p class="mb-4 pt-3 text-black">3. 想用JavaScript做一个图片预览的的效果。</p>
      <p class="mb-4 pt-3 text-black">3. 在托管在GitHub之后，浏览器无法访问。</p>
      <p class="mb-4 pt-3 text-black">4. 在托管在GitHub之后，在Google浏览器打不开url，但是在QQ浏览器才能打开，在CSDN上找了解决方法，还是未解决。</p>
      



      <hr class="my-4">

      <h4 class="font-weight-bold  mb-4 pt-3 text-black">总结</h4>
      <p class="w-responsive mb-5">
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;首先感谢王老师，在这里我棋歌称呼您，会显得更加亲切，是棋歌将我带入Web世界的。
        此外，棋歌带给我们的不仅仅是Web课程，还有棋歌的个人看法，
        我上课特别喜欢棋歌分享自己的看法，还有学习方法和思考方式。个人也很喜欢棋歌的上课方式，一边写代码，一边讲解，这样可以加深我对知识点的理解。
        甚至棋歌给我们推荐了一个更加高大上的分享方式，通过网页分享和记录生活，而不是QQ空间和朋友圈。
      </p>

      <p class="w-responsive mb-5">
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;然后是对自己所学知识以及这次Web大作业的总结。HTML，这算是棋歌教给我们最简单的一门语言了，
        需要知道HTML语言和标签的作用，不懂得地方用的时候再去查一下文档。CSS，这门语言是棋歌教给我最难得语言，我觉得CSS内容很多，
        自己想写出一个样式出来十分困难，之前尝试了写重庆交通大学官网网页，最后也还是放弃了，写的十分丑陋，而且很多地方不知道如何实现。
        还好后面棋歌详细讲了CSS框架MDB，不然我这个期末大作业估计是写的见不得人。后面的javaScript和TypeScript相对于CSS来说，
        我觉得更加有意思，和我们之前学的Java等语言更加相似， 学起来相对容易一点。最后的Angular我学的也不咋地，
        开始打算用Angular写一个动态网页，但是写了一天，我感觉没见成效，于是转为写静态网页。
      </p>

      <p class="w-responsive mb-5">
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;此次大作业让我对MDB框架有了更加清楚的认识，但是不仅仅是对MDB的认识，更是对利用框架开发思维的提高，
        现在很多语言都有框架，甚至有的公司有自己的开发框架，这种思维的训练也是必要的。虽然Web是结课了，但是我的Web生涯才刚刚开始，
        Web应该会陪伴我很多年， 即使是我不从事IT领域，Web与日常生活也息息相关。
      </p>
    </div>

  </main>
  <!-- End your project here-->

  <!-- jQuery -->
  <script type="text/javascript" src="js/jquery.min.js"></script>
  <!-- Bootstrap tooltips -->
  <script type="text/javascript" src="js/popper.min.js"></script>
  <!-- Bootstrap core JavaScript -->
  <script type="text/javascript" src="js/bootstrap.min.js"></script>
  <!-- MDB core JavaScript -->
  <script type="text/javascript" src="js/mdb.min.js"></script>
  <!-- Your custom scripts (optional) -->
  <script type="text/javascript"></script>

</body>

</html>